import React from 'react'
import "./aside.scss"
import { List, Popup } from 'antd-mobile'
import { useSelector, useDispatch } from 'react-redux'
import { useNavigate } from 'react-router-dom'
import { collapseSlice } from '@/store/modules/collapseSlice'

function Aside() {
    const collapse = useSelector(state => state.collapse.collapse)
    const navigate = useNavigate()
    const dispatch = useDispatch()

    return (
        <Popup
            visible={collapse}
            position='left'
            bodyStyle={{ width: '100vw' }}
        >
            <List>
                <List.Item onClick={() => { navigate(`/`); dispatch(collapseSlice.actions.colse()) }}>
                    首页
                </List.Item>
                <List.Item onClick={() => { navigate("/getmoney"); dispatch(collapseSlice.actions.colse()) }}>
                    提现
                </List.Item>
                <List.Item onClick={() => { navigate("/help"); dispatch(collapseSlice.actions.colse()) }}>
                    帮助中心
                </List.Item>
            </List>
        </Popup>
    )
}

export default Aside